草庐IT

Vue3 组件

全部标签

javascript - 在 vue 中发出带参数的事件

我正在尝试使用这样的参数发出函数。template:`{{selectedItem}}{{item.name}}`这是我正在尝试将项目像参数一样传递给方法。这是我尝试发出函数的组件:这是我的方法:selectedITem(arg1){console.log("cl")console.log(arg1)}如果我不尝试传递参数,那么一切正常,所以我的方法selectedITem正在运行。当我尝试像那样传递参数时,什么也没发生,我也没有收到任何错误。 最佳答案 $emit()中的以下参数是您发出的函数中的参数。$emit('select-

javascript - React 如何更新另一个组件的状态?

我对react很陌生,试图让一些组件工作。我有ObjectA:React.createClass({propTypes:{...},getInitialState:function(){return{myState:null}},updateMyState:function(value){this.setState({myState:value})}render:function(){return('hello'+{this.state.myState});}});ObjectB:React.createClass({propTypes:{...},render:function(){

javascript - 如何将自定义组件与 react-router 路由转换一起使用?

文章ConfirmingNavigation说明如何在转换Hook中使用浏览器确认框。美好的。但我想使用我自己的对话框。如果我要使用history模块中的方法,我认为这是可能的。是否可以使用react-router中的setRouteLeaveHook来做到这一点? 最佳答案 核心问题是setRouteLeaveHook期望钩子(Hook)函数同步返回它的结果。这意味着您没有时间显示自定义对话框组件、等待用户单击一个选项,然后然后返回结果。所以我们需要一种方法来指定一个异步钩子(Hook)。这是我写的实用函数://Asynchron

javascript - Vue.js:将页面标题分配给不同的路线

这个问题在这里已经有了答案:HowcanIbindthehtmlcontentinvuejs?(9个回答)关闭5年前。我正在使用vue.jsv1.0、vue-routerv0.7和WebPack构建一个网络应用程序。我正在关注SingleFileComponent模式,每个页面都有不同的组件。当我浏览Web应用程序页面时,我不知道如何更改不同路由(或不同组件)中的页面标题。我还希望页面标题在浏览器历史记录中可用。

javascript - React 16.3 中的上下文组件无效

我正在尝试在React16.3.1中使用新的Context组件。我正在运行一个非常简单的示例:constTestContext=React.createContext();exportdefaultclassTestextendsComponent{render(){return({value=>({value})});}}但是代码不会呈现,而是产生此错误:未捕获错误:元素类型无效:应为字符串(对于内置组件)或类/函数(对于复合组件)但得到:对象。似乎Provider和Consumer组件都不是有效组件,无法由React呈现。我是不是漏掉了什么? 最佳答案

javascript - Vue.js mixins 在重写实现中调用父方法

我正在使用vuejs-datepicker项目中的组件,但是我需要一些自定义行为,这就是为什么我决定创建自己的日期选择器并将vuejs-datepicker作为混合注入(inject)的原因。该解决方案工作正常,但我正在寻找一种方法来调用我覆盖的方法中的父方法。这就是我的组件现在的样子:importDatepickerfrom'vuejs-datepicker'exportdefault{props:{/***MycustompropertystartDatetoopenacalendaronthegivendatebydefault*/startDate:{validator:fun

javascript - Vue Uncaught TypeError : fn. 绑定(bind)不是一个函数

我的App.vue如下所示importHomeCentralfrom'./components/HomeCentral';exportdefault{name:'App',components:{HomeCentral,},};#app{font-family:"Avenir",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;color:#2c3e50;margin-top:60px;}我在src/compo

javascript - 根据名称渲染 React 组件

上下文:我正在开发一个基于小部件的Web应用程序(就像已停用的iGoogle,用户可以在其中选择他们想要显示的小部件)。每个小部件都是一个React组件。简化示例:这里有2个不同的小部件varHelloWidget=React.createClass({render:function(){returnHello{this.props.name};}});varHiWidget=React.createClass({render:function(){returnHi{this.props.name};}});作为用户,我选择了HiWidget,我的名字是“dude”,所以当系统从持久层

javascript - Ember 组件集成测试 : `link-to` href empty

我正在尝试编写组件集成测试,lathisblogpost,但我的组件有一个指向动态路由的link-to并且href属性没有被填充。这是我正在尝试的简化版本做。我的组件模板:{{#link-to"myModel"model}}这是我测试的相关部分:this.set('model',{id:'myId',name:'MyName'});this.render(hbs`{{my-componentmodel=model}}`);assert.equal(this.$('a').attr('href'),'/myModel/myId');//fails呈现link-to,只是没有href属性。

如何在Linux服务器上部署Vue项目

1.在本地将Vue项目打包以项目运行在vscode为例,在调试窗口输入 npmrunbuild待命令执行完毕之后,在项目目录下会生成dist文件夹,如下图 2.创建一个运行文件,名字是:server.js server.js中的内容如下:constexpress=require('express');constapp=express();app.use(express.static('./dist'));//运行时的端口,可以自己自定义constport=7777;app.listen(port,function(err){if(err){console.log(err);return;}co